<template>
    <div class="classify">
        <nerbarComponent :func="cheng"></nerbarComponent>
     <div style="height: 700px; overflow-y: auto; position: relative;">
        <yd-scrollnav>
            <yd-scrollnav-panel :label="item.label" v-for="item in list" :key="item.id">
                <p id="word">{{item.label}}</p>
            <yd-list  >
                <yd-list-item v-for="i in 2" :key="i" >
                    <img slot="img" src="//i1.mifile.cn/a1/pms_1537323963.1278763!220x220.jpg" @click="getmsg(i)">
                    <span slot="title">{{ item.label}} - 闪亮登场</span>
                </yd-list-item>
            </yd-list>
             
            </yd-scrollnav-panel>
        </yd-scrollnav>
    </div>
       
        
    </div>
</template>
<script>
import nerbarComponent from '../pulic/nerbar.vue'
export default {
     data() {
         return {
             cheng:"分类",
                list: [
                    {label: '小米手机',id:"0"},
                    {label: '华为手机',id:"1"},
                    {label: '苹果手机',id:"2"},
                    {label: '三星手机',id:"3"},
                    {label: '联想电脑',id:"4"},
                    {label: '红米手机',id:"5"},
                    {label: '诺基亚手机',id:"6"},
                    {label: 'oppo手机',id:"7"},
                    {label: '蛟龙手机',id:"8"},
                    {label: '移动手机',id:"9"}
                ],
              
                 listncontent: [
                  {id:"0",url:"//i1.mifile.cn/a1/pms_1537323963.1278763!220x220.jpg",msg:"小米8 青春版 4GB+64GB 潮流镜面渐变色，2400万自拍旗舰"},
                  {id:"1",url:"//i1.mifile.cn/a1/pms_1537323963.1278763!220x220.jpg",msg:"小米8 青春版 4GB+64GB 潮流镜面渐变色，2400万自拍旗舰"},
                  {id:"2",url:"//i1.mifile.cn/a1/pms_1537323963.1278763!220x220.jpg",msg:"小米8 青春版 4GB+64GB 潮流镜面渐变色，2400万自拍旗舰"},
                  {id:"3",url:"//i1.mifile.cn/a1/pms_1537323963.1278763!220x220.jpg",msg:"小米8 青春版 4GB+64GB 潮流镜面渐变色，2400万自拍旗舰"},
                  {id:"4",url:"//i1.mifile.cn/a1/pms_1537323963.1278763!220x220.jpg",msg:"小米8 青春版 4GB+64GB 潮流镜面渐变色，2400万自拍旗舰"}
              ]
             
            
             
         }
     },
      beforeRouteEnter (to, from, next) {
        next(vm =>{
           vm.$parent.$data.showfooter=false
          
        })
    },
   beforeRouteLeave (to, from, next) {
            this.$parent.$data.showfooter=true
    
           next()
    },
     methods: {
      getmsg(ids){
           this.$router.push({name:"classinfo",params:{id:ids}})
      }
     },
     components:{
     nerbarComponent
     }
}
</script>
<style scoped>
.classify{
    position: absolute;
    top:3px;
    left:4px;
    width:100%;
}
#word{
    font-size: 18px;
    font-weight:600;
    color:rgb(248, 8, 208)  
}



</style>
